<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>login</title>

    <script src="../JQuery/JQuery-2.1.4.min.js"></script>

</head>
<body>

    <h2>login</h2>
    <hr>

    <div>
        username:
        <input type="text" id="userName" placeholder="please intput your username!">
    </div>

    <br>
    <div>
        password:
        <input type="password" id="password" placeholder="please intput your password!">
    </div>

    <br>
    <button id="loginbtn">登录</button>
    <button id="registerbtn">注册</button>

    <script>

        $('#loginbtn').on("click",function () {

            var userName = $('#userName').val() // 用户名的唯一 id
            var password = $('#password').val() // 密码的唯一 id
            // alert(userName + "-"+ password)
            var d={ // json 数据类型
                "userName":userName ,
                "password":password
            }
            var url = "/login"
            $.ajax({ // 异步调用
                type:"post" ,
                url:url ,
                //  dataType:"json",
                data:d,
                success:function (data) {
                    if(data.status == "ok"){
                        alert("登录成功！")
                        sessionStorage.setItem("username",data.username);
                        sessionStorage.setItem("currentPath",data.currentPath);
                        window.location = 'page.html';
                    } else{
                        alert("用户名或密码错误!!")
                        jQuery("#userName").val(''); // 清空登录信息框
                        jQuery("#password").val('');
                    }
                }
            })
        })

        $('#registerbtn').on("click",function (){
            location.href="register.html";
        })

    </script>

</body>
</html>